<template>
    <div>
      <ul class="mui-table-view">
        <li class="mui-table-view-cell mui-media" v-for="item in newList" :key="item.id">
          <router-link :to="'/home/newsInfo/' + item.id ">
            <img class="mui-media-object mui-pull-left" :src="item.img_url">
            <div class="mui-media-body">
              <h1>{{ item.title }}</h1>
              <p class='mui-ellipsis'>
                <span>发表时间{{ item.add_time | dateFormat('YYYY-MM-DD HH:mm') }}</span>
                <span>点击了{{ item.click }}次</span>
              </p>
            </div>
          </router-link>
        </li>
      </ul>
    </div>
</template>

<script>
import axios from 'axios'

export default {
  data () {
    return {
      newList: []
    }
  },
  created () {
    this.getNewList()
  },
  methods: {
    getNewList () {
      axios.get('http://localhost:8080/api/newList').then(result => {
        console.log(result.data)
        this.newList = result.data
      })
    }
  }
}
</script>

<style scoped>
.mui-media-body h1{
  font-size:14px;
}
.mui-media-body .mui-ellipsis{
  font-size:12px;
  color:#226aff;
  display:flex;
  justify-content: space-between;
}

</style>
